<template>
	<!--
    	作者：1550495493@qq.com
    	时间：2019-08-15
    	描述：基地建设
    -->
	<div class="HomePage">
		<div class="location">
			<div class="location-text fl">
				<img class="location-img fl" src="../../images/BaseManager/Baseconstruction.png" />
				<p class="fr">基地建设</p>
			</div>
			<img class="biaotibg fl" src="../../images/home/biaotibg.png" />

		</div>
		<div class="IssuedNotice-box">
			<div class="search-box">
				<div class="fl">
					<input class="search" id="searchRoleVal" type="text" />
					<input class="btn" @click="searchBase" type="button" value="搜索" />
				</div>
				<input @click="SpecialistBtn" class="btn fr" type="button" value="新增建设" />
			</div>
		</div>
		<div class="PressRelease-list">
			<table>
				<thead>
					<tr>
						<th class="table-text-th1">基地名称</th>
						<th class="table-text-th1"> 基地类别 </th>
						<th class="table-text-th1"> 基地信息 </th>
						<th class="table-text-th1">共建协议</th>
						<th class="table-text-th1">基地建设</th>
						<th class="table-text-th1">基地状态</th>

						<th class="table-text-th1">退出申请</th>
					</tr>
				</thead>
				<tbody>
			        <tr v-if="total == 0">
			          <td  colspan="7">暂无数据！</td>
			        </tr>

					<tr v-else v-for="b in baseData">

						<td :title="b.name"> <span class="show-twoline">{{b.name}}</span></td>
						<td>{{b.type == 0?'现代农业综合示范基地':b.type == 1? '现代农业特色产业基地':b.type == 2?'乡村建设研究实践基地':b.type == 3?'新农村建设分布式服务站':'其他' }}</td>
						<td><input type="button" @click="toView(b.id)" value="查看" class="delete write" /></td>

						<td v-if="b.reserved2 == null || b.reserved2 == '' ">
							<!--共建协议-->
							<input v-if="b.status === 1 " @click="demand(b.id)" type="button" value="填写" class="delete write" />
							<input v-else-if="b.status === 2 " @click="demand(b.id)" type="button" value="填写" class="delete write" />
							<input v-else-if="b.status === 5 " @click="demand(b.id)" type="button" value="填写" class="delete write" />
              <p v-else>填写</p>
						</td>

              <td v-else>
                <input @click="demandView(b.reserved2,b.id)" type="button" value="查看" class="delete write" />
                <input  @click="demandUpd(b.reserved2,b.id)" type="button" value="修改" class="delete write" />
              </td>


						<td>
							<!--基地建设-->
							<input v-if="b.status === 1 " @click="AllTickets(b.id)" type="button" value="查看" class="delete write" />
							<input v-else-if="b.status === 2 " @click="AllTickets(b.id)" type="button" value="查看" class="delete write" />
							<input v-else-if="b.status === 5 " @click="AllTickets(b.id)" type="button" value="查看" class="delete write" />
              <p v-else>查看</p>
						</td>

						<td>
							<!--基地状态-->
              <p v-if="b.status === 1" >正常</p>
              <p v-if="b.status === 2" >申请退出待审核</p>
              <p v-if="b.status === 3" >申请退出已通过</p>
							<input v-if="b.status === 5" @click="applicationStatus(b.id)" type="button" value="申请退出不通过" class="write delete theClass" />
							<input v-if="b.status === 6" @click="temapplicationStatus(b.id)" type="button" value="基地已终止" class="write delete theClass" />
						</td>

						<td><input v-if="b.status == 1" @click="quitApplication(b.id, b.status, b.name)" type="button" value="申请" class="delete write" />
							<input v-else-if="b.status == 5" @click="quitApplication(b.id, b.status, b.name)" type="button" value="申请" class="delete write" />
              <p v-else >申请</p>
						</td>
					</tr>

				</tbody>
			</table>
			<!--total  数据总数   size  一页多少条数据   page  当前页码    changge 返回当前选择的页码  改变一页显示条 child  返回值就是一页显示条数  -->
			<pageination :total="total" :size="size" :page="page" :changge="pageFn" @child="obtainChild"></pageination>
		</div>
		<!-- 共建协议-模态框-->
		<div v-show="demandModelShow" id="demandDiv" class="tenant-model">
			<div class="tenant-model-content demandModel">
				<header class="tenant-model-header">
          <h3 v-if="type == 0">查看共建协议</h3>
					<h3 v-if="type == 3">填写共建协议</h3>
          <h3 v-if="type == 1">修改共建协议</h3>

					<span @click="closeModel" class="closeModel">×</span>
				</header>
				<div class="tenant-model-body">
					<div class="search-contain">
						<!--模态框内容板块-->
						<div class="Build-agreement">
							<p class="agreement-text">共建实践教学基地协议书</p>
							<div class="agreement-nav">
								<p>甲方：西南大学 </p>
								<p>乙方：<input class="input" v-model="AgreementObj.b" type="text" /> </p>
								<p class="agreement">本着互惠共赢原则，经友好协商，甲乙双方就共建实践教学基地事宜达成如下协议：</p>
								<p>一、甲方的责任与义务</p>
								<p class="agreement">1.提前向乙方提供实践计划（含学生人数、专业、实践时间、实践内容等）；</p>
								<p class="agreement">2.选派指导教师负责实践学生的实践指导、安全管理、生活安排及其它相关工作，监督学生遵守乙方有关规章制度；</p>
								<p class="agreement">3.为乙方在科研攻关、人才培养等方面提供支持，适时向乙方推荐优秀毕业生。</p>
								<p>二、乙方的责任与义务</p>
								<p class="agreement">1.协同甲方统筹安排实践方案，为甲方学生提供实践场所、设施和生活方便；</p>
								<p class="agreement">2.选派专人（有经验的专业技术人员、管理人员）指导学生实践并参与学生实践评价；协助甲方加强实践学生的学习生活管理；</p>
								<p class="agreement">3.及时向甲方反馈学生实践情况。</p>
								<p>三、其它未尽事宜，由双方协商解决。</p>
								<p class="agreement">本协议有效期 <input class="input" v-model="AgreementObj.year" type="text" />年，自签订之日起开始生效。</p>
								<p class="agreement">本协议壹式叁份，福建师范大学教务处、实践教学基地、相关学院各执一份。</p>
								<p class="agreement-write"><span>甲方代表：<input v-model="AgreementObj.aRepresentative" class="input" type="text" /></span><span class="fr">乙方代表：<input class="input" v-model="AgreementObj.bRepresentative" type="text" /></span></p>
								<p class="agreement-write"><span><input v-model="AgreementObj.leftYear" class="inputs" type="text" />年<input class="inputs" v-model="AgreementObj.leftMonth" type="text" />月<input v-model="AgreementObj.leftDay" class="inputs" type="text" />日</span><span class="fr"><input class="inputs" v-model="AgreementObj.rightYear" type="text" />年<input class="inputs" v-model="AgreementObj.rightMonth" type="text" />月<input class="inputs" v-model="AgreementObj.rightDay" type="text" />日</span></p>
							</div>
						</div>
						<div v-if="type !== 0" class="construction-agreement">
							<button v-if="type !== 1" @click="subAgreement" class="save">保存</button>
              <button v-else @click="subAgreement" class="save">修改</button>
						</div>
						
					</div>
				</div>
			</div>
		</div>
		<!-- 新增建设-模态框-->
		<div v-show="Specialist" class="tenant-model add-specialist">
			<div class="tenant-model-content Specialist">
				<header class="tenant-model-header ">
					<h3>新增建设</h3>
					<span @click="closeModel" class="closeModel">×</span>
				</header>
				<div class="tenant-model-body">
					<div class="search-contain">
						<!--模态框内容板块-->
						<div class="review-table">
							<div class="review">
								<form class="form-box" id="BaseConstructionThe">
									<div class="form-line">
										<label><span>*</span>基地名称：</label>
										<div class="input-box">
											<select name="baseId" id="baseId">
												<option value="">请选择</option>
                        						<option :value="b.id" v-for="b in baseSelect">{{b.name}}</option>
											</select>
										</div>
									</div>

									<div class="after">
										<div class="form-line fl">
											<label><span>*</span>开始时间：</label>
											<input  name="startTime" type="hidden" v-model="startTime" />
											<el-date-picker @input="changeInput()" v-model="startTime" type="date" placeholder="选择日期">
											</el-date-picker>
										</div>
									<!--</div>

									<div class="after ">-->
										<div class="form-line fl end-time">
											<label><span>*</span>结束时间：</label>
											<input  name="endTime" type="hidden" v-model="endTime" />
											<el-date-picker @input="changeInput()" v-model="endTime" type="date" placeholder="选择日期">
											</el-date-picker>
										</div>
									</div>

									<div class="form-line">
										<label class="textarea-label"><span>*</span>建设事项：</label>
										<textarea class="textarea" id="constructionMatters" name="constructionMatters"></textarea>
									</div>

									<div class="search-boxs imgbox">
										<label>附件上传：</label>
										<input name="attachment" type="hidden" v-model="attachment" />
										<input type="file" id="handIdFront2" accept=".doc,.docx,.xls,.xlsx,.pdf,.html,.txt,image/jpeg,image/tif,image/gif,image/png,image/bmp,.mp3,.mp4,.wav,.flv,.avi" @change="idFrontImg2($event)" style="display: none;" />
										<a class="Public-btn1 uploadbtn handIdFrontA " @click="touchOffIdInput2(1)">上传附件</a>
										<a class="Public-btn1 uploadbtn handIdFrontA " @click="delAtt" v-if="attachment">删除附件</a>
										<ul class="img-box" v-if="attachment">
											<li v-for="item in FileUploadAtt">{{item}}</li>
										</ul>
									</div>

								</form>
								<footer class="tenant-model-footer add-footer">
									<input type="button" class="determine" @click="subBaseConstruction" value="提交建设" />
								</footer>

							</div>
						</div>

					</div>
				</div>
			</div>
		</div>

		<!-- 建设查看-模态框-->
		<div v-show="SpecialistView" class="tenant-model SpecialistView">
			<div class="tenant-model-content Specialist">
				<header class="tenant-model-header ">
					<h3>查看建设详情</h3>
					<span @click="closeSpecialistView" class="closeModel">×</span>
				</header>
				<div class="tenant-model-body">
					<div class="search-contain">
						<!--模态框内容板块-->
						<div class="review-table">
							<div class="review build">
								<div>
									<span>基地名称：</span>
									<span v-for="b in baseSelect" v-if="b.id === obj.baseId">{{b.name}}</span>
								</div>
				
								<div class="after">
									<div class="fl">
										<span>  开始时间：</span>
										<span>{{obj.startTime}}</span>
									</div>
									<div class="fl build-endtime">
										<span>  结束时间：</span>
										<span>{{obj.endTime}}</span>
									</div>
								</div>
				
								<div>
									<span class="textarea-label">建设事项：</span>
									<div class="build-matter">{{obj.constructionMatters}}</div>
								</div>
				
								<div>
									<span class="textarea-label">附件：</span>
									<a @click="toSrc(obj.attachment)">预览</a>
								</div>
					
					
							</div>
						</div>

					</div>
				</div>
			</div>
		</div>

		<!-- 修改建设-模态框 -->
		<div v-show="SpecialistUpd" class="tenant-model modify-specialist">
			<div class="tenant-model-content Specialist">
				<header class="tenant-model-header ">
					<h3>修改建设</h3>
					<span @click="closeModifyModel" class="closeModel">×</span>
				</header>
				<div class="tenant-model-body">
					<div class="search-contain">
						<!--模态框内容板块-->
						<div class="review-table">
							<div class="review">
								<form class="form-box" id="BaseConstructionThe2">
									<div class="form-line">
										<label><span>*</span>基地名称：</label>
										<div class="input-box">
											<select name="baseId" id="baseIdThe">
						                        <option value="">请选择</option>
						                        <option  :value="b.id" v-for="b in baseSelect">{{b.name}}</option>
						                    </select>
										</div>
									</div>

									<div class="after">
										<div class="form-line fl">
											<label><span>*</span>开始时间：</label>
											<input name="startTime" type="hidden" v-model="obj.startTime"/>
											<el-date-picker @input="changeTime()" v-model="obj.startTime" type="date" placeholder="选择日期">
											</el-date-picker>
										</div>
										<div class="form-line fl endtime">
											<label><span>*</span>结束时间：</label>
											<input name="endTime" type="hidden" v-model="obj.endTime" />
											<el-date-picker v-model="obj.endTime" @input="changeTime()" type="date" placeholder="选择日期">
											</el-date-picker>
										</div>
									</div>

									<div class="form-line ">
										<label class="textarea-label"><span>*</span>建设事项：</label>
										<textarea class="textarea" v-model="obj.constructionMatters" name="constructionMatters"></textarea>
									</div>

									<div class="search-boxs imgbox">
										<label>附件上传：</label>
										<input name="attachment" type="hidden" v-model="obj.attachment" />
										<input type="file" id="handIdFront3" accept=".doc,.docx,.xls,.xlsx,.pdf,.html,.txt,image/jpeg,image/tif,image/gif,image/png,image/bmp,.mp3,.mp4,.wav,.flv,.avi" @change="idFrontImg3($event)" style="display: none;" />
										<a class="Public-btn1 uploadbtn handIdFrontA " @click="touchOffIdInput3(1)">上传附件</a>
										<a class="Public-btn1 uploadbtn handIdFrontA " @click="delAtt" v-if="FileUploadAtt.length">删除附件</a>
										<ul class="img-box" v-if="FileUploadAtt.length">
											<li v-for="item in FileUploadAtt">{{item}}</li>
										</ul>
									</div>

								</form>
								<footer class="tenant-model-footer modify-footer">
									<input type="button" class="determine" @click="subBaseConstructionUpd" value="保存" />
								</footer>

							</div>
						</div>

					</div>
				</div>
			</div>
		</div>

		<!-- 基地建设列表-模态框-->
		<div v-if="Tickets" class="tenant-model">
			<div class="tenant-model-content Tickets">
				<header class="tenant-model-header">
					<h3>查看基地建设</h3>
					<span @click="closeModel" class="closeModel">×</span>
				</header>
				<div class="tenant-model-body">
					<div class="search-contain">
						<!--模态框内容板块-->
						<div class="review-table">
							<div class="review">
								<!--<div class="search-box">
									<div class="fl">
									</div>
								</div>-->
								<table class="base-build">
									<tr>
										<th>序号</th>
										<th>建设开始时间</th>
										<th>建设结束时间</th>
										<th class="w400">建设事项</th>
										<th>操作</th>
									</tr>
									<tr v-if="total2 == 0" >
										<td class="center" colspan="5">暂无数据</td>
									</tr>
									<tr v-for="(c, index) in construction">
										<td>{{index+1}}</td>
										<td>{{formatData(c.startTime)}}</td>
										<td>{{formatData(c.endTime)}}</td>
										<td :title="c.constructionMatters">
											<span class="show-oneline-table">{{c.constructionMatters}}</span>
										</td>
										<td>
											<input @click="viewConstruction(c)" type="button" value="查看" class="delete write" />
											<input @click="updConstruction(c)" type="button" value="修改" class="delete write" />
											<input @click="delConstruction(c.id)" type="button" value="删除" class="delete write" />
										</td>
										<!--	<td><input type="button" value="下载" class="through" @click="downloadResources(c.attachment)" /></td>-->
									</tr>

								</table>
								<pageination :total="total2" :size="size2" :page="page2" :changge="pageFn2" @child="obtainChild2"></pageination>
							</div>
						</div>

					</div>
				</div>
			</div>
		</div>

		<!-- 基地退出申请-模态框-->
		<div v-show="QuitApplication" class="tenant-model">
			<form id="quitForm">
				<div class="tenant-model-content">
					<header class="tenant-model-header">
						<h3>基地退出申请</h3>
						<span @click="closeModel" class="closeModel">×</span>
					</header>
					<div class="tenant-model-body">
						<div class="search-contain">
							<div class="form-line">
								<label>基地名称：</label>
								<span class="base-name">{{baseName}}</span>
							</div>
							<!--模态框内容板块
							<input class="input-boxs" type="text" readonly v-model="baseName" /> -->
							<div class="form-line">
								<label><span class="star">*</span>内容：</label>
								<textarea placeholder="请输入基地退出理由" name="quitReason" id="quitReason" class="Quit-textarea"></textarea>
							</div>
							<div class="form-line input-required imgbox">
								<label>附件：</label>
								<input id="quitFile" type="hidden" v-model="quitFile" />
								<input type="file" id="handIdFront" accept=".doc,.docx,.xls,.xlsx,.pdf,.html,.txt,image/jpeg,image/tif,image/gif,image/png,image/bmp,.mp3,.mp4,.wav,.flv,.avi" @change="idFrontImg($event)" style="display: none;" />
								<a class="Public-btn1 uploadbtn handIdFrontA " @click="touchOffIdInput(1)">上传附件</a>
								<a class="Public-btn1 uploadbtn handIdFrontA " @click="delAtt()" v-if="FileUpload.length">删除附件</a>
								<ul class="img-box" v-if="FileUpload.length">
									<li v-for="item in FileUpload">{{item}}</li>
								</ul>
							</div>
							<div class="quitFormFooter">
								<input class="delete" type="button" value="确定" @click="subReason" />
							</div>
						</div>
					</div>
				</div>
			</form>
		</div>

		<!-- 申请状态-模态框-->
		<div v-if="ApplicationStatus" class="tenant-model">
			<div class="tenant-model-content Application  not-pass">
				<header class="tenant-model-header">
					<h3>查看申请退出不通过原因</h3>
					<span @click="closeModel" class="closeModel">×</span>
				</header>
				<div class="tenant-model-body">
					<div class="search-contain">
						<!--模态框内容板块-->
						<div class="rork">
							不通过原因：
							<div>{{base.reason}}</div>
						</div>
						<p>附件：<span @click="toSrc(base.reasonFile)"><a ></a>预览</span></p>
						<!--<div class="rork">
							<p>未通过理由：不符合基地退出条件</p>
							<p>附件：<span class="attachment">基地退出驳回书</span></p>
						</div>-->

					</div>
				</div>
			</div>
		</div>

		<!--基地種植-->
		<div v-if="temApplicationStatus" class="tenant-model">
			<div class="tenant-model-content Application  not-pass">
				<header class="tenant-model-header">
					<h3>查看基地终止原因</h3>
					<span @click="closeModel" class="closeModel">×</span>
				</header>
				<div class="tenant-model-body">
					<div class="search-contain">
						<!--模态框内容板块-->
						<div class="rork">
							终止内容：
							<div>{{base.terminationContent}}</div>
							
						</div>
						<p>附件：<span  @click="toSrc(base.termination)"><a ></a>预览</span></p>
						<!--<div class="rork">
                            <p>未通过理由：不符合基地退出条件</p>
                            <p>附件：<span class="attachment">基地退出驳回书</span></p>
                        </div>-->

					</div>
				</div>
			</div>
		</div>

		<!--查看-模态框 -->
		<div v-if="Application" class="tenant-model">
			<div class="tenant-model-content ApplicationStatus">
				<header class="tenant-model-header">
					<h3>查看基地信息</h3>
					<span @click="closeModel" class="closeModel">×</span>
				</header>
				<div class="tenant-model-body">
					<div class="search-contain">
						<!--模态框内容板块-->
						<form class="look-detail">
							<div class="after">
								<div class="form-line ">
									<label class="label-three">基地名称：</label>
									<div class="input-box">
										{{base.name}}
									</div>
								</div>
							
								<div class="form-line ">
									<label class="label-three">基地类别：</label>
									<div class="input-box">
										{{base.type}}
									</div>
								</div>
							</div>
							<div class="after">
								<div class="form-line ">
									<label class="label-three">基地地址：</label>
									<div class="input-box">
										{{base.address}}
									</div>
								</div>
								<div class="form-line ">
									<label class="label-three">申请单位：</label>
									<div class="input-box">
										{{base.unit}}
									</div>
								</div>
							</div>
							<div class="after">
								<div class="form-line ">
									<label class="label-three">通讯地址：</label>
									<div class="input-box">
										{{base.correspondenceAddress}}
									</div>
								</div>
								<div class="form-line ">
									<label class="label-three">联系人：</label>
									<div class="input-box">
										{{base.contact}}
									</div>
								</div>
							</div>
							<div class="after">
								<div class="form-line ">
									<label class="label-three">联系方式：</label>
									<div class="input-box">
										{{base.theContact}}
									</div>
								</div>
								<div class="form-line ">
									<label class="label-four">财务联系人：</label>
									<div class="input-box form-line-box">
										{{base.financialContact}}
									</div>
								</div>
							</div>
							<div class="after">
								<div class="form-line">
									<label class="label-two">财务联系电话：</label>
									<div class="input-box form-line-box telphone">
										{{base.contactNumber}}
									</div>
								</div>
								<div class="form-line ">
									<label class="label-one">附件：</label>
									<div class="input-box form-line-box" @click="toSrc(base.attachment)">
										<a>预览</a>
									</div>
								</div>
							</div>
							<div class="Website-right">
								<label class="label-three">基地简介：</label>
								<div class="input-box">
									{{base.introduction}}
								</div>
							</div>
							<div class="search-boxs imgbox Website-right">
								<label class="label-three">基地图片：</label>
								<!--<div class="imgbtn">-->
									<img :src="thatUrl+ base.picture" />
								<!--</div>-->
							</div>
						</form>
					</div>
				</div>
			</div>
		</div>

	</div>

</template>
<script src="./BaseConstruction.js"></script>

<style scoped>
	@import "BaseConstruction.css";
</style>
